<%@ include file="../common/IncludeTop.jsp"%>
<script>
	let xhr;

	function PSW(){
		let psw = document.getElementById("password").value.trim();
		let msg = document.getElementById('pswStrength');
		if(psw=="")
		{
			msg.className = 'errormsg';
			msg.innerText = "Please put in your password!";
		}
		else if(psw.search(/\d/)!=-1)
		{
			if(psw.search(/[a-z]/i)!=-1)
			{
				msg.className = 'okmsg';
				msg.innerText = "PasswordStrength: High";
			}
			else
			{
				msg.className = 'okmsg';
				msg.innerText = "PasswordStrength: Low";
			}
		}
	}

	function RPSW()
	{
		let psw = document.getElementById("password").value.trim();
		let rpsw = document.getElementById("repeatedPassword").value.trim();
		let msg = document.getElementById('rpsw');
		if(psw!==rpsw)
		{
			msg.className = 'errormsg';
			msg.innerText = "Two input password must be consistent";
		}
		else
		{
			msg.className = 'okmsg';
			msg.innerText = "Password OK";
		}
	}
</script>
<div id="Catalog">

<form action="saveAccount" method="post">
	<h3>User Information</h3>

	<table>
		<tr>
			<td>User ID:</td>
			<td>${sessionScope.account.username}</td>
		</tr>
		<tr>
			<td>New password:</td>
			<td><label>
				<input id="password" type="text" name="password" autofocus="autofocus" onblur="PSW();"/><br>
				<span id = "pswStrength"></span><br/>
			</label></td>
		</tr>
		<tr>
			<td>Repeat password:</td>
			<td><label>
				<input id="repeatedPassword" type="text" name="repeatedPassword" onblur="RPSW();"/><br>
				<span id = "rpsw"></span><br/>
			</label></td>
		</tr>
	</table>
	<%@ include file="IncludeAccountFields.jsp"%>
	<input type="submit" name="editAccount" value="Save Account Information" />

</form>
	<!--event="listOrders-->
	<a href="viewListOrder?username=${sessionScope.account.username}">My Orders</a>
</div>

<%@ include file="../common/IncludeBottom.jsp"%>
